
<div class="easyui-layout" data-options="fit:true">
	<form id="weightStatistic_form">
		时间:<input id="weightStatistic_startTime" name="startTime" value='${startTime! }' class="easyui-datebox theme-textbox-radius" style="height:32px;width:212px;text-align:center" data-options="editable: false"/>
		~<input id="weightStatistic_endTime" name="endTime" value='${endTime! }' class="easyui-datebox theme-textbox-radius" style="height:32px;width:212px;text-align:center" data-options="editable: false"/>
		<input name="customerIds" value="${customerIds! }" type="hidden">
	</form>
	<div class="easyui-layout" data-options="fit:true" style="width: 100%;height: 100%">
		<div id="lineChart" style="height: 400px; width: 500px; margin-top: 10px; display: inline-block;"></div>
	</div>
	
</div>
<script type="text/javascript">
	$(document).ready(function() {
		var $winW = $(window).width()*0.9;
		var $winH = $(window).height()*0.5;
		$('#lineChart').css({'width':$winW});
		$('#lineChart').css({'height':$winH});
// 		$(window).resize(function(){//当调整浏览器窗口的大小时，发生 resize 事件
//			initWeightStatistic();
// 		});
		$('#weightStatistic_startTime').datebox({
			onSelect: function(date){
				initWeightStatistic();
			}
		});
		$('#weightStatistic_endTime').datebox({
			onSelect: function(date){
				initWeightStatistic();
			}
		});
	});
	
	function initWeightStatistic(){
	
		var data = sy.serializeObject($("#weightStatistic_form"));
		var url = "/customerInfoStatistic/toCustomerWeightStatistic";
		common_ajax.ajaxDiv('weight_div', url, data);
	}
	var normWeight = '${customer.customerAgreement.std_weight! }';
	var intoWeight = '${customer.customerAgreement.before_weight! }';
	
	var maxWeight = (parseFloat(intoWeight) + 10).toFixed(1);
	/*折线图*/
	require.config({
		paths : {
			echarts : 'http://echarts.baidu.com/build/dist'
		}
	});
	require(
			[ 'echarts', 'echarts/chart/bar', 'echarts/chart/line' ],
			function(ec) {
				var myChart = ec.init(document.getElementById('lineChart'));
				var option = {
					tooltip : {
						trigger : 'axis'
					},
					legend : {
						data : [ '体重', '标准体重' ]
					},
					toolbox : {
						show : true,
						orient : 'horizontal',
						x : 'right',
						y : 'top',
						color : [ '#1e90ff', '#22bb22', '#4b0082', '#d2691e' ],
						backgroundColor : 'rgba(0,0,0,0)',
						borderColor : '#ccc',
						borderWidth : 0,
						padding : 5,
						showTitle : true,
						feature : {
							dataView : {
								show : true,
								title : '数据视图',
								readOnly : true,
								lang : [ '数据视图', '关闭' ],
								optionToContent : function(opt) {
									var axisData = opt.xAxis[0].data;
									var series = opt.series;
									var table = '<table style="width:100%;text-align:center"><tbody><tr>'
											+ '<td>时间</td>'
											+ '<td>'
											+ series[0].name
											+ '</td>'
											+ '<td>'
											+ series[1].name
											+ '</td>'
											+ '</tr>';
									for (var i = 0, l = axisData.length; i < l; i++) {
										table += '<tr>' + '<td>' + axisData[i]
												+ '</td>' + '<td>'
												+ series[0].data[i] + '</td>'
												+ '<td>' + series[1].data[i]
												+ '</td>' + '</tr>';
									}
									table += '</tbody></table>';
									return table;
								}
							},
							magicType : {
								show : true,
								title : {
									line : '动态类型切换-折线图',
									bar : '动态类型切换-柱形图',
								},
								type : [ 'line', 'bar' ]
							},
						}
					},
					calculable : false,
					xAxis : [ {
						type : 'category',
						axisLabel: {
							rotate: 35
						},
						boundaryGap : false,
						data : [
									<%
										if(!isEmpty(services)){
											for(var i=0;i<services.~size;i++){
												if(i == services.~size - 1){
													print('\'' + services[i].date + '\'');
												}else{
													print('\'' + services[i].date + '\',');
												}
											}
										}
									%>
						        
						        ]
					} ],
					yAxis : [ {
						min : (normWeight - 1).toFixed(1),
						max : maxWeight,
						axisLabel : {
			                formatter: '{value} g'
			            }
					} ],
					series : [ {
						name : '体重',
						type : 'line',
						data : [
									<%
										if(!isEmpty(services)){
											for(var i=0;i<services.~size;i++){
												if(i == services.~size - 1){
													print(services[i].weight);
												}else{
													print(services[i].weight + ',');
												}
											}
										}
									%>
						        ]
					}, {
						name : '标准体重',
						type : 'line',
						data : [
									<%
										if(!isEmpty(services)){
											for(var i=0;i<services.~size;i++){
												if(i == services.~size - 1){
													print(customer.customerAgreement.std_weight);
												}else{
													print(customer.customerAgreement.std_weight + ',');
												}
											}
										}
									%>
						        ]
					} ]
				};
				myChart.setOption(option);
			});
</script>
